<template lang="pug">
  div
    s-table(
      ref="table"
      v-if="$route.meta.menuType === 'C'"
      :queryFn="queryFn"
      :column="column"
      :filterProps="{fields: filterItems}"
      :queryPropsParams="{areaId: curArea.areaId, orderBy: curTab !== 'childrenHealth' ? '' : 'createTime', sequence: 'desc'}"
    )
      template(slot="published" slot-scope="text")
        el-tag(size="mini" effect="plain" :type="text ? 'success' : 'info'") {{text ? '已发布' : '未发布'}}
      template(slot="action" slot-scope="text, scope")
        template(v-if="curTab === 'psychologicalBehavior'")
          el-link(@click="infoRoute(scope[rowKey])" type="info") 查看
          el-popconfirm(
            v-if="!scope.published && scope.status ===2 "
            title="确认发布该条评测？"
            @confirm="() => publicHandle(scope.evaluateRecordId)"
            @onConfirm="() => publicHandle(scope.evaluateRecordId)"
          )
            el-link(
              slot="reference"
              type="success"
            ) 发布
        template(v-if="curTab === 'sport'")
          el-link(type="primary") 生成报告
        template(v-if="curTab === 'childrenHealth'")
          el-link(v-if="scope.times > 0" @click="modalHandle(scope[rowKey], scope.name, 'healthByChilrenModal')" type="info") 查看
          el-link(@click="infoRoute(scope[rowKey], 'add')" type="success") 新增
    router-view(v-else)
    component(v-if="modalObj.visible" :is="modalObj.component" :id="modalObj.id" :visible.sync="modalObj.visible" :title="modalObj.title")
</template>
<script>
import { mapGetters } from 'vuex'
import HealthByChilrenModal from '../components/healthByChilrenModal'
import { column, seachConfig } from './config'
import * as services from './api'

export default {
  components: {
    healthByChilrenModal: HealthByChilrenModal
  },
  data () {
    return {
      publicLoading: false,
      modalObj: {
        component: null,
        visible: false,
        id: '',
        title: ''
      }
    }
  },
  computed: {
    ...mapGetters(['curArea']),
    curTab () {
      const nameArr = this.$route.path.split('/')
      return nameArr[nameArr.length - 1]
    },
    rowKey () {
      const { curTab } = this
      return curTab === 'psychologicalBehavior' ? 'evaluateRecordId' : 'id'
    },
    column () {
      const { curTab } = this
      return column[curTab]
    },
    filterItems () {
      const { curTab } = this
      return seachConfig[curTab]
    },
    queryFn () {
      const { curTab } = this
      return services[curTab]
    }
  },
  watch: {
    curTab () {
      this.$nextTick(() => {
        this.refreshTable(true)
      })
    }
  },
  methods: {
    refreshTable (flag = true) {
      this.$refs.table.refresh(flag)
    },
    // 弹窗
    modalHandle (id, title, component) {
      this.modalObj = {
        id,
        title,
        component,
        visible: true
      }
    },
    // 查看详情
    infoRoute (id, type) {
      const { curTab } = this
      console.log(id, curTab)
      let path = ''
      const query = {}
      if (curTab === 'psychologicalBehavior') {
        path = '/childCare/evaluation/psychologicalBehavior/info'
        query.id = id
      }
      if (curTab === 'childrenHealth' && type === 'add') {
        path = '/childCare/evaluation/childrenHealth/info'
        query.childrenId = id
      }
      this.$router.push({
        path,
        query
      })
    },
    // 新增
    addHandle (row) {
      console.log(row)
    },
    // 心理行为发布
    publicHandle (evaluateRecordId) {
      this.publicLoading = true
      services.psyAndBePublic({ evaluateRecordId }).then(res => {
        this.$message.success('发布成功')
      }).finally(() => {
        this.publicLoading = false
      })
    }
  }
}
</script>
<style lang="scss" scoped>
</style>
